<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>DOM操作事件</title>
		<!-- 标签的DOM对象可以为元素定义事件/触发事件 -->
	</head>
	<body>
		<button>按钮</button>
	</body>
	<script>
		let btn = document.getElementsByTagName('button')[0]
		// 1.通过修改属性的方式定义事件
		function fun() {
			alert('用户点击了')
		}
		btn.onclick = fun
		// 上面的fun被覆盖了
		btn.onclick = function(){alert('用户又点击了')}
		// 2.添加事件监听
		btn.addEventListener('click', function() {
			console.log('事件监听1')
		})
		btn.addEventListener('click', function() {
			console.log('事件监听2')
		})
		// 用户点击后，先执行onclick的动作，然后依次执行事件监听
		
		// 模拟用户点击，触发事件
		btn.click()
	</script>
</html>